@font-face {
    font-family: "mazeFont";
    src: url(Azonix.otf);
    /* src: url(Pasajero.otf); */
}

body { 
    padding:0; margin:0; 
    height:100%; width:100%; 
    background-image: url(green_snake.jpg);
    color: white;
    text-shadow: 2px 3px 4px rgba(0,0,0,0.5);
}
div { font-family:arial; font-size:16px; font-weight:bold; text-align:center; }

canvas {
    border-radius: 10px;
    margin-left: 35px;
    box-shadow: 0px 0px 28px rgba(0,0,0,0.5), 0px 6px 10px rgba(0,0,0,0.44);
}

h1{
    margin: 5px auto;
    font-family: "mazeFont";
    font-size: 50px;
    /* color: orangered; */
    color: rgb(18, 70, 54);
    font-weight: 400;
}

.btnActive {
    display: block;
    background: rgb(0, 128, 128);
    border: none;
    outline: none;
    padding: 10px 20px;
    color: #fff;
    font-weight: 600;
    border-radius: 5px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

.btnInactive {
    display: none;
    background: rgb(148, 148, 148);
    border: none;
    outline: none;
    padding: 10px 20px;
    color: #fff;
    font-weight: 600;
    border-radius: 5px;
}
.btnActive:hover {
    background: rgb(0, 108, 108);
    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}
.btnActive:active {
    background: rgb(0, 88, 88);
}

input[type=radio]{
    /*display: block;*/
    height: 18px;
    width: 18px;
    border-radius: 50%;
    /*box-shadow: 0px 0px 28px rgba(0,0,0,0.5), 0px 6px 10px rgba(0,0,0,0.44);*/
}

.main-left {
    float: left;
    min-width: 60%;
}
.main-right {
    padding: 20px;
    margin-top: 75px;
    margin-left: 10px;
    margin-right: 40px;
    float: right;
    /* max-width: 24%; */
    text-align: left;
    font-size: 18px;
    /*color: darkblue;*/
    color: rgb(0, 88, 88);
    background-color: rgba(15, 214, 131, 0.2);
    border-radius: 10px;
    box-shadow: 0px 0px 28px rgba(0,0,0,0.5), 0px 6px 10px rgba(0,0,0,0.44);
}

.clearfix::before, .clearfix::after {
    display: table;
    clear: both;
    content: "";
} 

.container {
    margin: 0 auto;
    /* width: 61em; */
    width: 1000px;
}

#details{
    font-family: "mazeFont";
    font-size: 20px;
}